﻿@using SchoolProject2012.Langue;

 <div  class="metro">
    <div class="metro-sections">
        <div id="section1" class="metro-section" >
            <a data-next="#section2" data-prior="#section1" href="#" id="arrow0" class="next-section"></a>

            <div class="tile tile-double-vertical bg-color-yellow">
                <div class="tile-icon-large">
                    <img src="@Url.Content("~/Content/metroK/compte.png")" alt="MonCompte img" />
                </div>
                <span class="tile-label">Mon compte</span>
            </div>

            <div rel="/ChargeDePlacement/Entreprise" class="tile bg-color-purple">
                <div class="tile-icon-large">
                    <img src="@Url.Content("~/Content/metroK/entreprise.png")" alt="Entreprise img" />
                </div>
                <span class="tile-label">Entreprise</span>
            </div>

            <div rel="/ChargeDePlacement/Eleve" class="tile bg-color-pink">
                <div class="tile-icon-large">
                    <img src="@Url.Content("~/Content/metroK/eleve.png")" alt="Eleve img" />
                </div>
                <span class="tile-label">Eleve</span>
            </div>

             <div class="tile tile-double bg-color-orange">
                <div class="tile-icon-large">
                     <img src="@Url.Content("~/Content/metroK/stage.png")" alt="Eleve img" />
                </div>
                <span class="tile-label">Offre de stage</span>
                <span class="tile-counter">2 nouvelles Offres</span>
            </div>

            <div id="hotmail" class="tile tile-double bg-color-green">
                <div class="tile-icon-large">
                     <img src="@Url.Content("~/Content/metroK/hotmail.png")" alt="Mail img" />
                </div>
                <span class="tile-label">Mail</span>
                <span class="tile-counter">2 messages</span>
            </div>

            <div id="facebook" class="tile bg-color-blueDark">
                <div class="tile-icon-large">
                   <img src="@Url.Content("~/Content/metroK/facebook.png")" alt="Eleve img" />
                </div>
                <span class="tile-label">Facebook</span>
            </div>

            <div id="twitter" class="tile">
                <div class="tile-icon-large">
                     <img src="@Url.Content("~/Content/metroK/twitter.png")" alt="Eleve img" />
                </div>
                <span class="tile-label">Twitter</span>
            </div>

        </div>
        <div id="section2" class="metro-section">      
        </div>
        <div id="section3" class="metro-section">      
        </div>
        <div id="section4" class="metro-section">      
        </div>
    </div>
</div>

<script type="text/javascript">
    $(function () {
        window.prettyPrint && prettyPrint();
    })
    $(".metro").metro();
  </script>